<template>
  <!-- 交班处理 -->
  <view>
    <view class="form-container">
      <uni-forms ref="form" :modelValue="formData" :rules="rules" labelPosition="top">
        <view class="background-white bor-top">
          <uni-forms-item name="opinion" required label="意见" labelWidth="200">
            <CuRadioGroup
              v-model="formData.opinion"
              :list="dictData"
              :props="{ value: 'dictValue', label: 'dictLabel' }"
              @change="opinionChange"
            />
          </uni-forms-item>
        </view>
        <cu-cell-group class="bor-top" v-if="formData.opinion === '3'">
          <uni-forms-item name="jumpNode">
            <cu-cell
              title="回退节点"
              required
              link
              placeholder="请选择"
              :description="formData.jumpNodeName"
              @click="showJumpNode()"
            ></cu-cell>
          </uni-forms-item>
        </cu-cell-group>

        <view class="background-white bor-top">
          <uni-forms-item class="cu-mrgin-bottom-10" name="remark" required label="意见说明" labelWidth="200">
            <textarea
              v-model="formData.remark"
              class="text-area"
              placeholder="简要说明审批意见(限50字)"
              maxlength="50"
            />
          </uni-forms-item>
        </view>
        <view class="submit" @click="handleSubmit">完成</view>
      </uni-forms>
    </view>

    <JumpNodePicker ref="jumpNodePicker" :data="rollbackNodesList" @confirm="jumpNodeConfirm" />
  </view>
</template>

<script>
import CuCellGroup from '@/components/cu-cell/cu-cell-group.vue'
import CuCell from '@/components/cu-cell/cu-cell.vue'
import CuRadioGroup from '@/components/cu-radio-group/cu-radio-group.vue'
import JumpNodePicker from './JumpNodePicker.vue'

import { getDicts } from '@/api/system/dict.js'
import { process, getRollbackNodes } from '@/api/duty-basic/duty-shifting.js'
import { takeoverMonitorConfirm } from '@/api/duty-basic/duty-shifting.js'

export default {
  name: 'StepShiftsConfirm',
  data() {
    return {
      nodeTypeName: {
        2: '生产',
        3: '设备',
        4: '安全',
        5: '综合',
        6: '其他'
      },
      node: '',
      formData: {
        changeShiftInfoId: '',
        processTaskId: '',
        flowNode: '',
        jumpNode: '',
        jumpNodeName: '',
        opinion: '1',
        remark: ''
      },
      rules: {
        opinion: {
          rules: [
            {
              required: true,
              errorMessage: '不能为空'
            }
          ]
        },
        remark: {
          rules: [
            {
              required: true,
              errorMessage: '备注不能为空'
            }
          ]
        },
        jumpNode: {
          rules: [
            {
              required: true,
              errorMessage: '回退节点不能为空'
            }
          ]
        }
      },
      dictData: [],
      rollbackNodesList: []
    }
  },
  mounted() {
    let curPage = getCurrentPages()
    let query = curPage[curPage.length - 1].options
    this.node = query.node
    this.getDicts()
    this.getRollbackNodes()
  },
  methods: {
    opinionChange() {
      this.formData.jumpNode = ''
      this.formData.jumpNodeName = ''
    },
    getRollbackNodes() {
      let curPage = getCurrentPages()
      let query = curPage[curPage.length - 1].options
      getRollbackNodes(query.taskId).then((res) => {
        this.rollbackNodesList = res.data
      })
    },
    jumpNodeConfirm(obj) {
      this.formData.jumpNode = obj.value
      this.formData.jumpNodeName = obj.name
    },
    showJumpNode() {
      this.$refs.jumpNodePicker.open()
    },
    getDicts() {
      getDicts('dtr_act_duty_shifting_node_option').then((res) => {
        for (let i = 0; i < res.data.length; i++) {
          const element = res.data[i]
          if ([7, 8, 9, 10, 11].indexOf(Number(this.node)) > -1) {
            if (element.dictLabel !== '指定回退') {
              this.dictData.push(element)
            }
          }
          if ([12, 13].indexOf(Number(this.node)) > -1) {
            if (element.dictLabel !== '不予通过') {
              this.dictData.push(element)
            }
          }
        }
      })
    },
    async handleSubmit() {
      let curPage = getCurrentPages()
      let query = curPage[curPage.length - 1].options
      await this.$refs.form.validate()

      this.formData.changeShiftInfoId = query.id
      this.formData.processTaskId = query.taskId
      this.formData.flowNode = query.node
      await process({
        ...this.formData
      })
      uni.showToast({
        title: '处理成功！',
        icon: 'success'
      })

      setTimeout(() => {
        uni.navigateBack()
      }, 1000)
    }
  },
  onReady() {
    // 需要在onReady中设置规则
    this.$refs.form.setRules(this.rules)
  },
  components: {
    CuCellGroup,
    CuCell,
    CuRadioGroup,
    JumpNodePicker
  }
}
</script>

<style lang="scss" scoped>
.submit {
  width: 600rpx;
  height: 88rpx;
  background: #454a5e;
  border-radius: 50rpx 50rpx 50rpx 50rpx;
  opacity: 1;
  text-align: center;
  line-height: 88rpx;
  font-size: 36rpx;
  font-weight: 400;
  color: #ffffff;
  margin: 0 auto;
  margin-top: 70rpx;
  margin-bottom: 70rpx;
}

.text-area {
  height: 300rpx;
}
</style>
